<!-- subpkg_consult/room/components/patient-info.vue -->
<script lang="ts" setup>
import type { Image } from '@/types/consult';
import type { ConsultRecord } from '@/types/room';

// 患病时长
const illnessTimes = [
  {
    type: 1,
    value: '一周内',
  },
  {
    type: 2,
    value: '一个月内',
  },
  {
    type: 3,
    value: '半年内',
  },
  {
    type: 4,
    value: '半年以上',
  },
]
// 是否就诊过
const consultFlags = [
  {
    type: 1,
    value: '就诊过',
  },
  {
    type: 0,
    value: '没有就诊过',
  },
]

defineProps<{
  info: ConsultRecord
}>()


const previewImg = (imgs: Image[])=>{
  if(imgs && imgs.length > 0) {
    uni.previewImage({
      urls: imgs.map(item => item.url)
    })
  }
}
</script>
<template>
  <!-- 患者信息（21） -->
  <view class="patient-info">
    <view class="header">
      <view class="title">{{ info.patientInfo?.name }} {{ info.patientInfo?.genderValue }} {{ info.patientInfo?.age }}岁</view>
      <view class="note">
        {{ illnessTimes.find(item => item.type === info.illnessTime)?.value }} | 
        {{ consultFlags.find(item => item.type === info.consultFlag)?.value}}
      </view>
    </view>
    <view class="content">
      <view class="list-item">
        <text class="label">病情描述</text>
        <text class="note">{{ info.illnessDesc }}</text>
      </view>
      <view class="list-item">
        <text class="label">图片</text>
        <text class="note" @click="previewImg(info.pictures)">点击查看</text>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
.patient-info {
  padding: 30rpx;
  margin-top: 60rpx;
  border-radius: 20rpx;
  box-sizing: border-box;
  background-color: #fff;

  .header {
    padding-bottom: 20rpx;
    border-bottom: 1rpx solid #ededed;

    .title {
      font-size: 32rpx;
      color: #121826;
      margin-bottom: 10rpx;
    }

    .note {
      font-size: 26rpx;
      color: #848484;
    }
  }

  .content {
    margin-top: 20rpx;
    font-size: 26rpx;

    .list-item {
      display: flex;
      margin-top: 10rpx;
    }

    .label {
      width: 130rpx;
      color: #3c3e42;
    }

    .note {
      flex: 1;
      line-height: 1.4;
      color: #848484;
    }
  }
}
</style>